<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/commons/taglibs.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
	<head>
		<title>会说话的时光</title>

		<!-- meta -->
		<meta charset="UTF-8">
	    <meta name="viewport" content="width=device-width, initial-scale=1">
		<meta name="keywords" content="时光  说话" />
		<meta name="description" content="会说话的时光"/>
	    <!-- css -->
		<link rel="stylesheet" href="${base}/css/bootstrap.min.css">
		<link rel="stylesheet" href="${base}/css/ionicons.min.css">
		<link rel="stylesheet" href="${base}/css/pace.css">
	    <link rel="stylesheet" href="${base}/css/custom.css">
	    <link rel="stylesheet" href="${base}/css/gh-buttons.css">

	    <!-- js -->
	    <script src="${base}/js/jquery-2.1.3.min.js"></script>
	    <script src="${base}/js/bootstrap.min.js"></script>
	    <script src="${base}/js/pace.min.js"></script>
	    <script src="${base}/js/modernizr.custom.js"></script>
	    <script src="${base}/js/script.js"></script>
    	<script src="${base}/js/nicEdit.js" type="text/javascript"></script>
    	
    	<!-- begin layui -->
    		<script src="${base}/plugin/layui/css/layui.css"></script>
    		<script src="${base}/plugin/layui/layui.js"></script>
    	<!-- end layui -->
    	
    	
	<script type="text/javascript">
	//一般直接写在一个js文件中
	layui.use('layedit', function(){
  var layedit = layui.layedit
  ,$ = layui.jquery;
  
  //构建一个默认的编辑器
  var index = layedit.build('LAY_demo1');
  
  //编辑器外部操作
  var active = {
    content: function(){
      alert(layedit.getContent(index)); //获取编辑器内容
    }
    ,text: function(){
      alert(layedit.getText(index)); //获取编辑器纯文本内容
    }
    ,selection: function(){
      alert(layedit.getSelection(index));
    }
  };
  
  $('.site-demo-layedit').on('click', function(){
    var type = $(this).data('type');
    active[type] ? active[type].call(this) : '';
  });
	bkLib.onDomLoaded(function() {
		new nicEditor({fullPanel : true}).panelInstance('content');
	});
	</script>
	</head>

	<body id="page">
		<%@ include file="menu.jsp" %>

		<div class="content-body">
			<div class="container">
				<div class="row">
						<h1 class="page-title">写信</h1>
							<div class="entry-content clearfix">
								<form  class="contact-form" id="fom">
									<input type="hidden" name="type" >
									<div class="row">
										<div class="col-md-6 col-md-offset-3">
											<input type="text" name="title" placeholder="标题" required>
											<select id="category" name="category">
												<option value="随笔">随笔</option>
												<option value="故事">故事</option>
												<option value="其他">其他</option>
											</select>
											<input type="text" name="subtitle" placeholder="副标题" >
											<textarea name="content" id="content" rows="7" placeholder="正文内容" required></textarea>
											
											<a href="javascript:void(0);" class="button big" id="savebtn"><span>保存</span></a>
											<a href="javascript:void(0);" class="button big" id="publishbtn"><span>发布</span></a>
										</div>
									</div>	<!-- row -->
								</form>
							</div>
				</div>
			</div>
		</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
  <legend>完整功能（没错，目前工具栏只有这么多）</legend>
</fieldset>
 
<textarea class="layui-textarea" id="LAY_demo1" style="display: none">  
  把编辑器的初始内容放在这textarea即可
</textarea>		
<div class="site-demo-button" style="margin-top: 20px;">
  <button class="layui-btn site-demo-layedit" data-type="content">获取编辑器内容</button>
  <button class="layui-btn site-demo-layedit" data-type="text">获取编辑器纯文本内容</button>
  <button class="layui-btn site-demo-layedit" data-type="selection">获取编辑器选中内容</button>
</div>
	</body>
<script language="javaScript">
	
	$("#savebtn").click(function(){
		$("#type").val("save");
		alert($(".nicEdit-main").html());
		$("#content").val($(".nicEdit-main").html());
		$.ajax({
		    url:'${base}/article/save',
			cache: false,
            type: "POST",
            data:$('#fom').serialize(),// 你的formid
            async: false,
            error: function(request) {
                alert("Connection error");
            },
            success: function(data) {
               alert(data);
            }
		})
	})
	
	$("#publishbtn").click(function(){
		$("#type").val("publish");
		$("#content").val($(".nicEdit-main").html());
		$.ajax({
		    url:'${base}/article/publish',
			cache: false,
            type: "POST",
            data:$('#fom').serialize(),// 你的formid
            async: false,
            error: function(request) {
                alert("Connection error");
            },
            success: function(data) {
               alert(data);
            }
		})
	})
</script>
</html>
